1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
|
import React from 'react';
import Link from 'next/link';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Badge } from '@/components/ui/badge';
import { ShoppingCart, Users, Settings, ArrowRight, Building2 } from 'lucide-react';
export default function LandingPage() {
const portals = [
{
id: 'sales',
title: '기술영업포탈',
description: '기술 영업 단계에서의 RFQ를 관리할 수 있는 통합 플랫폼',
icon: Users,
color: 'from-emerald-500 to-teal-500',
href: '/sales',
features: ['벤더 관리', '기술 영업 RFQ']
},
{
id: 'purchase',
title: '구매포탈',
description: '협력업체에서부터 마지막 발주까지 원스톱 구매 솔루션',
icon: ShoppingCart,
color: 'from-blue-500 to-cyan-500',
href: '/procurement',
features: ['협력업체 관리', '구매관리']
},
{
id: 'design',
title: '설계포탈',
description: '벤더가 플랫폼을 통해 데이터와 문서를 제출할 수 있게 하고 TBE를 처리할 수 있는 플랫폼',
icon: Settings,
color: 'from-purple-500 to-pink-500',
href: '/engineering',
features: ['설계 기준정보관리', 'TBE']
}
];
return (
<div className="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-900 dark:to-slate-800">
{/* Header */}
<header className="relative overflow-hidden">
<div className="absolute inset-0 bg-gradient-to-r from-blue-600/10 to-purple-600/10"></div>
<div className="relative container mx-auto px-4 py-16 text-center">
<div className="flex items-center justify-center mb-6">
<Building2 className="h-12 w-12 text-blue-600 mr-3" />
<h1 className="text-4xl md:text-6xl font-bold bg-gradient-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent">
enterprise Vendor Co-work Platform
</h1>
</div>
<p className="text-xl md:text-2xl text-slate-600 dark:text-slate-300 max-w-3xl mx-auto leading-relaxed">
통합된 비즈니스 솔루션으로 구매부터 설계까지,
<br />모든 업무 프로세스를 하나의 플랫폼에서 관리하세요
</p>
<Badge variant="secondary" className="mt-6 px-4 py-2 text-sm">
Enterprise Ready
</Badge>
</div>
</header>
{/* Main Portal Selection */}
<main className="container mx-auto px-4 py-16">
<div className="text-center mb-16">
<h2 className="text-3xl md:text-4xl font-bold text-slate-800 dark:text-slate-100 mb-4">
포털을 선택하세요
</h2>
<p className="text-lg text-slate-600 dark:text-slate-400 max-w-2xl mx-auto">
각 포털은 특화된 기능과 도구를 제공하여 업무 효율성을 극대화합니다
</p>
</div>
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8 max-w-7xl mx-auto">
{portals.map((portal) => {
const Icon = portal.icon;
return (
<Link key={portal.id} href={portal.href} className="block">
<Card className="relative group cursor-pointer transition-all duration-300 hover:scale-105 hover:shadow-2xl border-0 bg-white dark:bg-slate-800 overflow-hidden h-full">
<div className={`absolute inset-0 bg-gradient-to-br ${portal.color} opacity-5 group-hover:opacity-10 transition-opacity duration-300`}></div>
<CardHeader className="relative pb-4">
<div className={`w-16 h-16 rounded-2xl bg-gradient-to-br ${portal.color} flex items-center justify-center mb-4 group-hover:scale-110 transition-transform duration-300`}>
<Icon className="h-8 w-8 text-white" />
</div>
<CardTitle className="text-2xl font-bold text-slate-800 dark:text-slate-100 group-hover:text-transparent group-hover:bg-gradient-to-r group-hover:from-blue-600 group-hover:to-purple-600 group-hover:bg-clip-text transition-all duration-300">
{portal.title}
</CardTitle>
<CardDescription className="text-slate-600 dark:text-slate-400 text-base leading-relaxed">
{portal.description}
</CardDescription>
</CardHeader>
<CardContent className="relative">
<div className="mb-6">
<h4 className="font-semibold text-slate-700 dark:text-slate-300 mb-3">주요 기능</h4>
<div className="space-y-2">
{portal.features.map((feature, idx) => (
<div key={idx} className="flex items-center text-sm text-slate-600 dark:text-slate-400">
<div className={`w-2 h-2 rounded-full bg-gradient-to-r ${portal.color} mr-3`}></div>
{feature}
</div>
))}
</div>
</div>
<Button className={`w-full bg-gradient-to-r ${portal.color} hover:opacity-90 text-white border-0 group-hover:shadow-lg transition-all duration-300`}>
포털 접속하기
<ArrowRight className="ml-2 h-4 w-4 group-hover:translate-x-1 transition-transform duration-300" />
</Button>
</CardContent>
</Card>
</Link>
);
})}
</div>
{/* Additional Info Section */}
<div className="mt-20 text-center">
<div className="bg-white dark:bg-slate-800 rounded-3xl p-8 md:p-12 shadow-xl border border-slate-200 dark:border-slate-700 max-w-4xl mx-auto">
<h3 className="text-2xl md:text-3xl font-bold text-slate-800 dark:text-slate-100 mb-4">
모든 포털이 연동됩니다
</h3>
<p className="text-lg text-slate-600 dark:text-slate-400 mb-8">
구매, 영업, 설계 포털 간의 데이터가 실시간으로 동기화되어
효율적인 업무 협업이 가능합니다
</p>
<div className="flex flex-wrap justify-center gap-4">
<Badge variant="outline" className="px-4 py-2">실시간 동기화</Badge>
<Badge variant="outline" className="px-4 py-2">통합 대시보드</Badge>
<Badge variant="outline" className="px-4 py-2">권한 관리</Badge>
<Badge variant="outline" className="px-4 py-2">보안 인증</Badge>
</div>
</div>
</div>
</main>
{/* Footer */}
<footer className="bg-slate-800 dark:bg-slate-900 text-white py-12 mt-20">
<div className="container mx-auto px-4 text-center">
<div className="flex items-center justify-center mb-6">
<Building2 className="h-8 w-8 mr-2" />
<span className="text-xl font-semibold">enterprise Vendor Co-work Platform</span>
</div>
<p className="text-slate-400 mb-4">
© 2025 삼성중공업. All rights reserved.
</p>
{/* <div className="flex justify-center space-x-6 text-sm text-slate-400">
<Link href="/terms" className="hover:text-white transition-colors">이용약관</Link>
<Link href="/privacy" className="hover:text-white transition-colors">개인정보처리방침</Link>
<Link href="/support" className="hover:text-white transition-colors">고객지원</Link>
</div> */}
</div>
</footer>
</div>
);
}
|
